/*
	 Button Maker
	 by Chris Coyier
	 http://css-tricks.com
	 modifikasi oleh: Taufik Nurrohman
	 http://hompimpaalaihumgambreng.blogspot.com
*/

*{margin:0;padding:0;}
body{font:12px Calibri, Ubuntu, Arial, serif;background:#fafafa;color:#333;}
body, html{height:100%;}
#page-wrap{width:750px;margin:30px auto;}
#float-left{float:left;}
#button-box{position:relative;height:145px;width:300px;overflow:auto;margin-bottom:15px;-moz-box-shadow:inset 0 0 7px #aaa;-webkit-box-shadow:inset 0 0 7px #aaa;box-shadow:inset 0 0 7px #aaa;background:#f5f5f5;}
#controls{padding:20px 10px 20px 20px;float:right;}
#scrollbar{width:400px;height:520px;padding:0 10px 0 0;overflow:auto;}
#float-left select{width:200px;margin:2px 0 5px;font:bold 11px Verdana, Arial, Sans-Serif;border:1px solid #bbb;padding:2px;background:#ccc;color:#333;display:block;}
#float-left option{border-none;}
h1{font:46px Georgia, Serif;margin:0 0 20px 0;}

.tombol{
position:absolute;
}

.tombol{
cursor:pointer;
border-color:#3F6124;
border-style:solid;
border-width:1px 0 0 0;
	
background:#648632;
background:-webkit-gradient(linear, left top, left bottom, from(#648632), to(#416B00));
background:-moz-linear-gradient(top,  #648632,  #416B00);
	
padding:10px 20px;
	
-webkit-border-radius:8px;
-moz-border-radius:8px;
border-radius:8px;
	
-webkit-box-shadow:0 1px 2px #444444;
-moz-box-shadow:0 1px 2px #444444;
box-shadow:0 1px 2px #444444;
	
text-shadow:0 1px 0 rgba(0,0,0,0.5);
	
color:#ffffff;
font:normal 16px Calibri, Arial, Serif;
text-decoration:none;
vertical-align:middle;
}
.tombol:hover{
border-color:#AC0B03;
background:#A2110C;
background:-webkit-gradient(linear, left top, left bottom, from(#A2110C), to(#750A00));
background:-moz-linear-gradient(top,  #A2110C,  #AC0B03);
color:#ffffff;
}
.tombol:active{
background:#444444;
background:-webkit-gradient(linear, left top, left bottom, from(#750A00), to(#A2110C));
background:-moz-linear-gradient(top,  #AC0B03,  #A2110C);	outline:0;
}

#the-css{
display:none;
}

.sliderBar{
margin:10px 0 15px 0;
}

.hompi-warna{font-size:16px;font-weight:bold;cursor:pointer;}

.ui-dialog-content{
font:12px Monaco, MonoSpace;
}

#colors > div{
position:relative;
width:100%;
height:30px;
margin:0 0 5px 0;
}

#colors > div > input{
width:300px;
border:0;
cursor:pointer;
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
text-indent:-9999px;
}

#colors > div > label{
font-weight:normal;
}

#colors > div > label:hover{
font-weight:bold;
}

#colors > div > label{
display:block;
text-align:center;
color:black;
cursor:pointer;
position:relative;
z-index:20;
color:white;
text-shadow:0 0 8px black, 0 1px 0 black;
top:0;
left:0;
width:100%;
height:100%;
padding-top:5px;
position:absolute;
}

.colorpicker{
z-index:1000;
}